<template>
  <!-- 报价管理 -->
  
  <div class="pro_quote_list">
    <!-- <mouse-click v-show="judge"></mouse-click>
    <mouse-move v-show="judge"></mouse-move> -->
    <el-tabs type="border-card" @tab-click="tabClick">
      <el-tab-pane label="报价管理">
        <div style="padding:1em;margin-bottom:1em">
          <el-select @change="projectChange" v-model="searchForm.proDetailId" style="margin-right: 6px" filterable clearable placeholder="请选择项目" value-key="name">
            <el-option v-for="item in projects" :key="item.id" :label="item.name" :value="item.id" />
          </el-select>
          <el-input v-model="searchForm.name" style="width: auto" placeholder="请输入设备名"></el-input>
          <el-input v-model="searchForm.model" placeholder="请输入型号" style="width: auto" ></el-input>
          <el-button style="margin-right: 6px;z-index: 999" type="primary" icon="el-icon-search" size="small" @click="toSearch">查询</el-button>
          <span @click="handleCopy(projectName, $event)">{{projectName}}</span>
          <div style="float:right">
            <a-statistic :value-style="{ color: '#cf1322' }" title="最低价(￥)" style="float:right;margin-left:20px" :precision="2" :value="minPrice"/>
            <a-statistic :value-style="{ color: '#3f8600' }" title="最高价(￥)" style="float:right" :precision="2" :value="maxPrice" />
          </div>
        </div>
        <div>
          <div>
            <div style="padding:10px">
              <el-tooltip class="item" effect="dark" content="批量送审" placement="bottom-start">
                <el-button :disabled="selectedRowKeys.length > 0?false:true" type="warning" size="mini" icon="el-icon-s-check" @click="batchSendAudit"></el-button>
              </el-tooltip>
              <el-tooltip class="item" effect="dark" content="批量送比价" placement="bottom-start">
                <el-button :disabled="selectedRowKeys.length > 0?false:true" type="warning" size="mini" icon="el-icon-s-promotion" @click="batchSendCompare"></el-button>
              </el-tooltip>
                <el-tooltip class="item" effect="dark" content="取消送比价" placement="bottom-start">
                <el-button :disabled="selectedRowKeys.length > 0?false:true" type="warning" size="mini" icon="el-icon-close" @click="cancelCompare"></el-button>
              </el-tooltip>
              <el-tooltip class="item" effect="dark" content="批量导入报价" placement="bottom-start">
                <el-button type="primary" size="mini" @click="batchImport" icon="el-icon-upload"></el-button>
              </el-tooltip>
            </div>
            <div>
              <a-table class="parentTable" :loading="loading" size="middle" :data-source="inquiryList" :scroll="{ x: 786 }"
                :row-class-name="tableRowClassName" @expand="expandChange"
                :rowKey="record => record.id"
                :row-selection="{ selectedRowKeys: selectedRowKeys, onChange: indexHandleSelectionChange, selections: [{
                      key: 'all-data',
                      text: '全选',
                      onSelect: () => {
                        this.selectedRowKeys =  inquiryList.map(item=>{return item.id});
                      },
                  }]}">
              <a-table-column key="sendReviewStatus" :width="60" align="center" title="送审" data-index="sendReviewStatus">
                <template slot-scope="t, r">
                  <a-icon v-if="t > 0 && r.quoteNum != 0" type ="close"/>
                  <a-icon v-else-if="t == 0 && r.quoteNum != 0" type ="check"/>
                  <a-icon v-else-if="r.quoteNum == 0" type ="stop"/>
                </template>
              </a-table-column>
                <a-table-column key="sendCompareStatus" :width="60" align="center" title="送比价" data-index="sendCompareStatus">
                <template slot-scope="t, r">
                  <a-icon v-if="t > 0 && r.quoteNum != 0" type ="close"/>
                  <a-icon v-else-if="t == 0 && r.quoteNum != 0" type ="check"/>
                  <a-icon v-else-if="r.quoteNum == 0" type ="stop"/>
                </template>
              </a-table-column>
              <a-table-column v-show="item.dataIndex!='brand'" v-for="item in currentTemplate.tableColumn" ellipsis="true" :width="item.width" :align="item.align" :key="item.key" :title="item.title" :dataIndex="item.dataIndex">
                <template slot-scope="text">
                  <span :title="text" @click="handleCopy(text, $event)">{{ text }}</span>
                </template>
              </a-table-column>
              <a-table-column :width="100" align="center" key="quoteNum" title="报价商家数量" data-index="quoteNum">
                <template slot-scope="text">
                  <el-tag>{{text}}</el-tag>
                </template>
              </a-table-column>
              <a-table-column
                key="operation"
                title="操作"
                data-index="operation"
                align="center"
                :width="230">
                <template slot-scope="text, record">
                  <el-button type="success" icon="el-icon-star-on" size="mini" style="padding: 7px 10px;background: #faad14;border-color:#faad14" @click="poolChoose(record)">产品池</el-button>
                </template>
              </a-table-column>
              <a-table
                slot="expandedRowRender"
                slot-scope="scope"
                class="childTable"
                :class="scope.detailList.length > 0 ? { noData: false}:{noData: true}"
                :scroll="{x: 1780}"
                :columns="innerColumns"
                :data-source="scope.detailList"
                :pagination="false"
                :loading="childLoading[scope.id]"
                :row-class-name="tableRowClassName2"
              >
                <span class="ellipsis" slot="technicalAudit" slot-scope="text">
                  <el-tag size="small" :type="text!=null?(text === 0 ? 'info':(text === 1? 'success':'danger')):'warning'">{{ statu(text) }}</el-tag>
                </span>
                <span class="ellipsis" slot="businessAudit" slot-scope="text">
                  <el-tag size="small" :type="text!=null?(text === 0 ? 'info':(text === 1? 'success':'danger')):'warning'">{{ statu(text) }}</el-tag>
                </span>
                <template
                  v-for="col in ['supplier','suBrand','suParams','suModel','brand','suPrice','suTotalPrice','suDelivery',
                            'warranty','suRemark']"
                  :slot="col"
                  slot-scope="text, record"
                >
                  <div :key="col" :title="text">
                    <a-input
                      v-if="record.editable&&col!='supplier'"
                      style="margin: -5px 0"
                      :value="text"
                      @change="e => handleChange(e.target.value, record, col)"
                    />
                    <template v-if="(!record.editable||col=='supplier')&&col!='suTotalPrice'" >
                      <span class="ellipsis" @click="handleCopy(text, $event)">{{ text }}</span>
                    </template>
                    <template v-if="col=='suTotalPrice'">
                      <span class="ellipsis" @click="handleCopy(text, $event)">{{Number(record.suPrice * record.number).toFixed(2)}}</span>
                    </template>
                  </div>
                </template>

                <template slot="technicalRemark" slot-scope="text">
                  <a-tooltip placement="topLeft" :title="text+''">
                    <span @click="handleCopy(text, $event)">{{ text }}</span>
                  </a-tooltip>
                </template>
                <template slot="businessRemark" slot-scope="text">
                  <a-tooltip placement="topLeft" :title="text+''">
                    <span @click="handleCopy(text, $event)">{{ text }}</span>
                  </a-tooltip>
                </template>

                <template slot="operation" slot-scope="text, record">
                  <div class="editable-row-operations" style="text-align: center">
                <span v-if="record.editable">
                    <el-button type="primary" icon="el-icon-upload" size="mini" @click="toEdit(record)" />
                  <el-tooltip class="item" effect="dark" content="行内编辑" placement="bottom-start">
                    <el-button type="success" size="mini" style="padding: 7px 10px;" @click="save(record)">保存</el-button>
                  </el-tooltip>
                  <a-popconfirm title="确定取消修改吗?" @confirm="() => cancel(record)">
                    <el-tooltip class="item" effect="dark" content="取消" placement="bottom-start">
                      <el-button type="danger" size="mini" style="padding: 7px 10px;">取消</el-button>
                    </el-tooltip>
                  </a-popconfirm>
                </span>
                    <span v-else>
                    <el-button type="primary" icon="el-icon-upload" size="mini" @click="toEdit(record)" />
                  <el-tooltip v-if="record.technicalAudit==0" class="item" effect="dark" content="行内编辑" placement="bottom-start">
                    <el-button type="primary" icon="el-icon-edit" size="mini" @click="edit(record)" />
                  </el-tooltip>
                  <el-tooltip v-if="record.technicalAudit==2 || record.businessAudit==2" class="item" effect="dark" content="新增报价" placement="bottom-start">
                    <el-button type="primary" icon="el-icon-plus" size="mini" @click="addQuote(record)" />
                  </el-tooltip>
                      <el-button type="danger" icon="el-icon-delete" size="mini" @click="deleteQuote(record)"></el-button>
                </span>
                  </div>
                </template>
              </a-table>
              </a-table>
            </div>
          </div>
        </div>

      </el-tab-pane>
      <el-tab-pane label="供应商报价管理">
        <div style="padding:10px">
          <el-select v-model="searchFormQuote.proId" style="margin-right: 6px" filterable clearable placeholder="请选择项目" value-key="name">
            <el-option v-for="item in projects" :key="item.id" :label="item.name" :value="item.id" />
          </el-select>
          <el-input v-model="searchFormQuote.sort" style="width: auto" placeholder="询价序号"></el-input>
          <el-input v-model="searchFormQuote.supplier" style="width: auto" placeholder="供应商名"></el-input>
          <el-input v-model="searchFormQuote.name" style="width: auto" placeholder="设备名"></el-input>
          <el-button style="margin-right: 6px" type="primary" icon="el-icon-search" size="small" @click="toSearchQuote">查询</el-button>
        </div>
        <div>
          <div style="padding:10px">
            <el-button type="danger" :disabled="quote.selected.length > 0?false:true" size="small" icon="el-icon-delete" @click="batchDelete">批量删除</el-button>
          </div>
          <div style="padding:10px">
            <a-table 
              bordered
              class="table"
              size="middle"
              :rowKey="record => record.id"
              :pagination="quote.pagination"
              :loading="quote.loading"
              :customRow="rowClick"
              :data-source="quote.data"
              :row-selection="{ selectedRowKeys: quote.selected, onChange: handleSelectionChange}">
              <a-table-column width="60px" key="sort" title="序号" data-index="sort" align="center" ellipsis="true"/>
              <a-table-column key="name" title="设备名" data-index="name" align="center" ellipsis="true"/>
              <a-table-column key="supplier" title="报价商" data-index="supplier" align="center" ellipsis="true"/>
              <a-table-column key="suBrand" title="报价品牌" data-index="suBrand" align="center" ellipsis="true"/>
              <a-table-column key="suParams" title="参数" data-index="suParams" align="center" ellipsis="true"/>
              <a-table-column key="suModel" title="型号" data-index="suModel" align="center" ellipsis="true"/>
              <a-table-column key="suPrice" title="单价" data-index="suPrice" align="center" ellipsis="true"/>
              <a-table-column key="suDelivery" title="货期" data-index="suDelivery" align="center" ellipsis="true"/>
              <a-table-column key="warranty" title="质保期" data-index="warranty" align="center" ellipsis="true"/>
              <a-table-column key="quoteValidity" title="报价有效期" data-index="quoteValidity" align="center" ellipsis="true"/>
              <a-table-column key="paymentMethod" title="付款方式" data-index="paymentMethod" align="center" ellipsis="true"/>
              <a-table-column key="bond" title="履约保证金" data-index="bond" align="center" ellipsis="true"/>
              <a-table-column key="suRemark" title="报价备注" data-index="suRemark" align="center" ellipsis="true"/>
              <a-table-column width="60px" key="dataSource" title="来源" data-index="dataSource" align="center">
                <template slot-scope="text">
                  <el-tag v-if="text == 0" type="warning">{{"产品池"}}</el-tag>
                  <el-tag v-else-if="text == 1" type="success">{{"市场"}}</el-tag>
                </template>
              </a-table-column>
              <a-table-column key="images" title="图片" data-index="images" align="center">
                <template slot-scope="text">
                  <div v-for="(item, key) in text" :key="key">
                    <el-image fit="contain" style="height: 40px; width:auto" :src="item" :preview-src-list="[item]" v-if="item!=null && item != ''">
                      <div slot="error" class="image-slot">
                        <i class="el-icon-picture-outline"></i>
                      </div>
                    </el-image>
                  </div>
                </template>
              </a-table-column>
              <a-table-column key="time" title="添加时间" data-index="time" align="center">
                <template slot-scope="text">{{text?dateFormat(parseInt(text)):''}}</template>
              </a-table-column>
              <a-table-column key="operator" title="添加人" data-index="operator" align="center" ellipsis="true"/>
              <a-table-column :width="100" fixed="right" align="center" key="action" title="操作">
                <template slot-scope="text, record">
                  <el-button type="warning" size="small" icon="el-icon-edit" @click.stop="updateSupplyMessage(record)">修改</el-button>
                </template>
            </a-table-column>
            </a-table>
          </div>
        </div>
      </el-tab-pane>
    </el-tabs>

    <!-- 产品池模态框 -->
    <el-dialog v-el-drag-dialog title="选择产品池产品" class="poolDialog" :visible.sync="poolDialog.visible">
      <el-form :model="poolDialog.form" status-icon>
        <el-row :gutter="10">
          <el-col :sm="24" :lg="12">
            <el-form-item label="采购项" label-width="80px" prop="item">{{poolDialog.form.item}}</el-form-item>
          </el-col>
          <el-col :sm="24" :lg="12">
            <el-form-item label="品牌" label-width="80px" prop="brand">{{poolDialog.form.brand}}</el-form-item>
          </el-col>
        </el-row>
        <el-row>
          <el-col :sm="24" :lg="12">
            <el-form-item label="型号" label-width="80px" prop="model">{{poolDialog.form.model}}</el-form-item>
          </el-col>
          <el-col :sm="24" :lg="12">
            <el-form-item label="技术要求" label-width="80px" prop="params">{{poolDialog.form.params}}</el-form-item>
          </el-col>
        </el-row>
        <el-input type="text"
                  v-model="poolDialog.searchForm.name"
                  placeholder="设备名" size="small" style="max-width: 200px;"></el-input>
        <el-input type="text"
                  v-model="poolDialog.searchForm.model"
                  placeholder="型号" size="small" style="max-width: 200px;"></el-input>
        <el-button type="primary" size="small" @click="poolFind">查询</el-button>
        <div style="margin-top: 6px">
          <a-table
            size="small"
            :pagination="poolDialog.table.pagination"
            :rowKey="record => record.id"
            :loading="poolDialog.table.loading"
            :data-source="poolDialog.table.data"
            :scroll="poolDialog.table.data.length > 0 ?{ x: 600, y: 240}:{}"
            :rowSelection="{selectedRowKeys: poolDialog.table.selected, onChange: poolTableChange, type:'radio'}"
          >
            <a-table-column :width="100" align="center" key="name" title="设备名称" data-index="name" />
            <a-table-column :width="100" align="center" key="supplier" title="供应商" data-index="supplier" />
            <a-table-column :width="150" align="center" key="params" title="技术参数" data-index="params" />
            <a-table-column :width="150" align="center" key="model" title="品牌型号" data-index="model" />
            <a-table-column :width="70" align="center" key="price" title="单价" data-index="price" />
            <a-table-column :width="70" align="center" key="number" title="数量" data-index="number" />
            <a-table-column :width="100" align="center" key="delivery" title="货期" data-index="delivery" />
          </a-table>
        </div>
      </el-form>
      <div slot="footer" class="dialog-footer">
        <el-button size="small" @click="poolDialog.visible = false">取消</el-button>
        <el-button type="primary" size="small" @click="poolSubmit">提交</el-button>
      </div>
    </el-dialog>

    <!-- 模态框 -->
    <el-dialog v-el-drag-dialog :title="title" :visible.sync="visible">
      <el-steps :active="active" simple style="background: #d8f1e3;margin-bottom: 8px;padding: 13px 4%;height: 36px">
        <el-step title="上传询价文件" icon="el-icon-upload" />
        <el-step title="上传技术文件" icon="el-icon-upload" />
      </el-steps>
      <el-form ref="form" :model="form" :rules="codeRules" status-icon>
        <div>
          <div :style="active === 1?{display: 'block'}:{display:'none'}">
            <a-upload-dragger
              name="file"
              :multiple="true"
              :action="fileUploadUrl"
              withCredentials
              list-type="picture"
              :before-upload="beforeUpload"
              :file-list="fileList"
              @change="uploadStatusChange"
              :headers="headers"
            >
              <p class="ant-upload-drag-icon">
                <a-icon type="inbox" />
              </p>
              <p class="ant-upload-text" style="color: #40a9ff">
                上传询价文件
              </p>
              <p class="ant-upload-text">
                点击或者拖拽文件来上传
              </p>
              <p class="ant-upload-hint">
                支持单个或多个文件上传. 单个文件请不要超过12M
              </p>
            </a-upload-dragger>

          </div>
          <div :style="active === 2?{display: 'block'}:{display:'none'}">
            <a-upload-dragger
              name="file"
              :multiple="true"
              :action="fileUploadUrl"
              withCredentials
              list-type="picture"
              :before-upload="beforeUpload"
              :file-list="fileList1"
              @change="uploadStatusChange1"
              :headers="headers"
            >
              <p class="ant-upload-drag-icon">
                <a-icon type="inbox" />
              </p>
              <p class="ant-upload-text" style="color: #40a9ff">
                上传技术文件
              </p>
              <p class="ant-upload-text">
                点击或者拖拽文件来上传
              </p>
              <p class="ant-upload-hint">
                支持单个或多个文件上传. 单个文件请不要超过12M
              </p>
            </a-upload-dragger>
          </div>
        </div>
      </el-form>
      <div slot="footer" class="dialog-footer">
        <el-button size="small" @click="cancelHandler">{{ this.active === 1?'取消':'上一步' }}</el-button>
        <el-button type="primary" :loading="submitLoading" size="small" @click="saveRecordHandler('form')">{{ this.active === 2?'确定':'下一步' }}</el-button>
      </div>
    </el-dialog>

    <el-dialog v-el-drag-dialog title="批量导入报价" class="importDialog" :visible.sync="visible2">
      <el-form ref="form1" :model="form1" :rules="codeRules" status-icon>
        <div>
          <el-form-item label="供应商" label-width="80px" size="small">
            <el-select style="margin-left: 8px" v-model="form1.supplierId" filterable clearable placeholder="请选择供应商" value-key="name" size="small">
              <el-option v-for="item in suppliers" :key="item.id" :label="item.supplier" :value="item.id" />
            </el-select>
          </el-form-item>
          <div style="margin: 8px 0;position: relative">
            <el-button @click="clickFileInput" type="primary" size="small"><a-icon type="file-excel" style="font-size: 12px;margin-right: 5px"/>excel导入</el-button>
            <input type="file" ref="upload" accept=".xls,.xlsx" @change="readExcel" class="outputlist_upload">
            <div v-if="excelRows>0" style="position: absolute;left: 0;padding: 4px 0;font-size: 12px;color: #909399">从Excel读取到
              <span style="color: #42b983">{{excelRows}}</span>条数据
            </div>
          </div>
          <el-input
            style="margin: 12px 0"
            type="textarea"
            placeholder="点击上方按钮导入或者复制excel中数据来粘贴"
            :autosize="{ minRows: 4, maxRows: 12}"
            v-model="importData">
          </el-input>
        </div>
      </el-form>
      <div slot="footer" class="dialog-footer">
        <el-button size="small" @click="cancelHandler2">取消</el-button>
        <el-button type="primary" :loading="submitLoading" size="small" @click="importHandler('form1')">提交</el-button>
      </div>
    </el-dialog>

    <!-- 模态框 -->
    <el-dialog v-el-drag-dialog title="新增报价" :visible.sync="quoteVisible">
      <el-form :model="quoteForm" status-icon>
        <el-row>
          <el-col :sm="24" :lg="12">
            <el-form-item size="mini" label="供应商" label-width="80px" prop="supplier">
              <el-input v-model="quoteForm.supplier" autocomplete="off" size="small" />
            </el-form-item>
          </el-col>
          <el-col :sm="24" :lg="12">
            <el-form-item label="型号" label-width="80px" prop="suModel">
              <el-input v-model="quoteForm.suModel" autocomplete="off" size="small" />
            </el-form-item>
          </el-col>
        </el-row>
        <el-row>
          <el-col :sm="24" :lg="12">
            <el-form-item label="品牌" label-width="80px" prop="suBrand">
              <el-input v-model="quoteForm.suBrand" autocomplete="off" size="small" />
            </el-form-item>
          </el-col>
          <el-col :sm="24" :lg="12">
            <el-form-item label="技术参数" label-width="80px" prop="suParams">
              <el-input v-model="quoteForm.suParams" autocomplete="off" size="small" />
            </el-form-item>
          </el-col>
        </el-row>
        <el-row>
          <el-col :sm="24" :lg="12">
            <el-form-item label="单价" label-width="80px" prop="suPrice">
              <el-input v-model="quoteForm.suPrice" autocomplete="off" size="small" />
            </el-form-item>
          </el-col>
          <el-col :sm="24" :lg="12">
            <el-form-item label="总价" label-width="80px" prop="suTotalPrice">
              <el-input v-model="quoteForm.suTotalPrice" autocomplete="off" size="small" />
            </el-form-item>
          </el-col>
        </el-row>
        <el-row>
          <el-col :sm="24" :lg="12">
            <el-form-item label="货期" label-width="80px" prop="suDelivery">
              <el-input v-model="quoteForm.suDelivery" autocomplete="off" size="small" />
            </el-form-item>
          </el-col>
          <el-col :sm="24" :lg="12">
            <el-form-item label="质保期" label-width="80px" prop="warranty">
              <el-input v-model="quoteForm.warranty" autocomplete="off" size="small" />
            </el-form-item>
          </el-col>
        </el-row>
        <el-row>
          <el-col :sm="24" :lg="12">
            <el-form-item label="备注" label-width="80px" prop="suRemark">
              <el-input v-model="quoteForm.suRemark" autocomplete="off" size="small" />
            </el-form-item>
          </el-col>
        </el-row>
      </el-form>
      <div slot="footer" class="dialog-footer">
        <el-button size="small" @click="inquiryVisible = false">取消</el-button>
        <el-button type="primary" size="small" @click="addQuoteSubmit">提交</el-button>
      </div>
    </el-dialog>

    <!--送审模态框 begin-->
    <el-dialog v-el-drag-dialog title="送审" :visible.sync="sendCheckDialog.visible">
      <el-form :model="sendCheckDialog.form" :rules="sendCheckDialog.rules" ref="sendCheckDialogForm" status-icon>
        <el-form-item label="审核人" label-width="80px" prop="checkUsers">
          <el-select
            v-model="sendCheckDialog.form.checkUsers"
            value-key="id"
            placeholder="请选择审核人"
            multiple
            filterable
            clearable>
            <el-option v-for="user in checkUsers" :key="user.id" :label="user.username" :value="user.id"/>
          </el-select>
        </el-form-item>
        <el-form-item label="审核时间段" label-width="80px" prop="time">
          <el-date-picker
            v-model="sendCheckDialog.form.time"
            unlink-panels
            style="max-width: 300px"
            value-format="timestamp"
            type="daterange"
            range-separator="至"
            start-placeholder="开始日期"
            end-placeholder="结束日期">
          </el-date-picker>
        </el-form-item>
        <el-form-item label="送审备注" label-width="80px" prop="remark">
          <el-input v-model="sendCheckDialog.form.remark" type="textarea"></el-input>
        </el-form-item>
      </el-form>
      <div slot="footer" class="dialog-footer">
        <el-button size="small" @click="sendCheckDialog.visible = false">取消</el-button>
        <el-button type="primary" size="small" @click="sendCheckSubmit">提交</el-button>
      </div>
    </el-dialog>
    <!--送审模态框 end-->

    <!--供货信息修改-->
    <el-dialog v-el-drag-dialog title="供货信息修改" :visible.sync="supplyMessage.visible">
      <el-form :model="supplyMessage.form" status-icon>
        <el-row :gutter="20">
          <el-col :span="8">
            <el-form-item label="序号" label-width="80px" prop="sort">
              <el-input v-model="supplyMessage.form.sort" type="input" :disabled="true"></el-input>
            </el-form-item>
          </el-col>
          <el-col :span="8">
            <el-form-item label="设备名" label-width="80px" prop="name">
              <el-input v-model="supplyMessage.form.name" type="input" :disabled="true"></el-input>
            </el-form-item>
          </el-col>
          <el-col :span="8">
            <el-form-item label="报价商" label-width="80px" prop="supplier">
              <el-select style="margin-left: 8px" v-model="supplyMessage.form.supplierId" filterable clearable placeholder="请选择供应商" value-key="name" size="small">
                <el-option v-for="item in suppliers" :key="item.id" :label="item.supplier" :value="item.id" />
              </el-select>
            </el-form-item>
          </el-col>
        </el-row>
        <el-row :gutter="20">
          <el-col :span="8">
            <el-form-item label="报价品牌" label-width="80px" prop="suBrand">
              <el-input v-model="supplyMessage.form.suBrand" type="input"></el-input>
            </el-form-item>
          </el-col>
          <el-col :span="8">
            <el-form-item label="型号" label-width="80px" prop="suModel">
              <el-input v-model="supplyMessage.form.suModel" type="input"></el-input>
            </el-form-item>
          </el-col>
          <el-col :span="8">
            <el-form-item label="单价" label-width="80px" prop="suPrice">
              <el-input v-model="supplyMessage.form.suPrice" type="input"></el-input>
            </el-form-item>
          </el-col>
        </el-row>
        <el-row :gutter="20">
          <el-col :span="12">
            <el-form-item label="货期" label-width="80px" prop="suDelivery">
              <el-input v-model="supplyMessage.form.suDelivery" type="input"></el-input>
            </el-form-item>
          </el-col>
          <el-col :span="12">
            <el-form-item label="质保期" label-width="80px" prop="warranty">
              <el-input v-model="supplyMessage.form.warranty" type="input"></el-input>
            </el-form-item>
          </el-col>
        </el-row>
        <el-row :gutter="20">
          <el-col :span="8">
            <el-form-item label="报价有效期" label-width="80px" prop="quoteValidity">
              <el-input v-model="supplyMessage.form.quoteValidity" type="input"></el-input>
            </el-form-item>
          </el-col>
          <el-col :span="8">
            <el-form-item label="付款方式" label-width="80px" prop="paymentMethod">
              <el-input v-model="supplyMessage.form.paymentMethod" type="input"></el-input>
            </el-form-item>
          </el-col>
          <el-col :span="8">
            <el-form-item label="履约保证金" label-width="80px" prop="bond">
              <el-input v-model="supplyMessage.form.bond" type="input"></el-input>
            </el-form-item>
          </el-col>
        </el-row>
        <el-row :gutter="20">
          <el-col :span="24">
            <el-form-item label="报价备注" label-width="80px" prop="suRemark">
              <el-input v-model="supplyMessage.form.suRemark" type="input"></el-input>
            </el-form-item>
          </el-col>
        </el-row>
        <el-row :gutter="20">
          <el-col :span="24">
            <el-form-item label="参数" label-width="80px" prop="suParams">
              <el-input v-model="supplyMessage.form.suParams" type="textarea"></el-input>
            </el-form-item>
          </el-col>
        </el-row>
        <el-row :gutter="20" style="margin-top:20px">
          <el-col :span="24">
            <div class="clearfix">
              <a-upload
                :action="fileUploadUrl"
                list-type="picture-card"
                :file-list="fileList2"
                @change="handleChange1"
              >
                <div v-if="fileList2.length < 8">
                  <a-icon type="plus" />
                  <div class="ant-upload-text">
                    Upload
                  </div>
                </div>
              </a-upload>
              <a-modal :visible="previewVisible" :footer="null" @cancel="handleCancel">
                <img alt="example" style="width: 100%" :src="previewImage" />
              </a-modal>
            </div>
          </el-col>
        </el-row>
      </el-form>
      <div slot="footer" class="dialog-footer">
        <el-button size="small" @click="supplyMessage.visible = false">取消</el-button>
        <el-button type="primary" size="small" @click="supplyMessageSubmit">提交</el-button>
      </div>
    </el-dialog>
  </div>
</template>
<script>
  import {dateTimeFormat, dateFormat } from '@/utils/format'
  import '@/styles/auto-style.css'
  import request from '@/utils/request'
  import qs from 'querystring'
  import { getToken, getUser } from '@/utils/auth'
  import XLSX from 'xlsx'
  import clip from '@/utils/clipboard'
  import elDragDialog from '@/directive/el-drag-dialog'
  import { getAction, postActionByJson, postActionByQueryString } from '@/api/manage'
  import { beforeUpload, uploadStatusChange } from '@/utils/upload'
  import index from '@/components/Breadcrumb/index.vue'
  import MouseMove from '@/components/Mouse/mouseMove.vue'
  import mouseClick from '@/components/Mouse/mouseClick.vue'

  const innerColumns = [
    { title: '供应商', dataIndex: 'supplier', scopedSlots: { customRender: 'supplier' }, fixed: 'left', width: 110,
      sorter: (a, b) => a.supplier.length - b.supplier.length, sortDirections: ['descend', 'ascend'] },
    { title: '技审', dataIndex: 'technicalAudit', scopedSlots: { customRender: 'technicalAudit' }, width: 110,
      sorter: (a, b) => a.technicalAudit.length - b.technicalAudit.length, sortDirections: ['descend', 'ascend'] },
    { title: '商审', dataIndex: 'businessAudit', scopedSlots: { customRender: 'businessAudit' }, width: 110,
      sorter: (a, b) => a.businessAudit.length - b.businessAudit.length, sortDirections: ['descend', 'ascend'] },
    { title: '商家技术参数', dataIndex: 'suParams', scopedSlots: { customRender: 'suParams' }, width: 100,
      sorter: (a, b) => a.suParams.length - b.suParams.length, sortDirections: ['descend', 'ascend'] },
    { title: '商家品牌', dataIndex: 'suBrand', scopedSlots: { customRender: 'suBrand' }, width: 110,
      sorter: (a, b) => a.suBrand.length - b.suBrand.length, sortDirections: ['descend', 'ascend'] },
    { title: '商家型号', dataIndex: 'suModel', scopedSlots: { customRender: 'suModel' }, width: 110,
      sorter: (a, b) => a.suModel.length - b.suModel.length, sortDirections: ['descend', 'ascend'] },
    { title: '商家单价', dataIndex: 'suPrice', scopedSlots: { customRender: 'suPrice' }, width: 100, ellipsis: true,
      sorter: (a, b) => a.suPrice - b.suPrice, sortDirections: ['descend', 'ascend'] },
    { title: '商家总价', dataIndex: 'suTotalPrice', scopedSlots: { customRender: 'suTotalPrice' }, width: 100, ellipsis: true,
      sorter: (a, b) => a.suTotalPrice - b.suTotalPrice, sortDirections: ['descend', 'ascend'] },
    { title: '商家货期', dataIndex: 'suDelivery', scopedSlots: { customRender: 'suDelivery' }, width: 100, ellipsis: true,
      sorter: (a, b) => a.suDelivery - b.suDelivery, sortDirections: ['descend', 'ascend'] },
    { title: '质保期', dataIndex: 'warranty', scopedSlots: { customRender: 'warranty' }, width: 100, ellipsis: true,
      sorter: (a, b) => a.warranty - b.warranty, sortDirections: ['descend', 'ascend'] },
    { title: '商家备注', dataIndex: 'suRemark', scopedSlots: { customRender: 'suRemark' }, width: 100, ellipsis: true },
    { title: '技审备注', dataIndex: 'technicalRemark', scopedSlots: { customRender: 'technicalRemark' }, width: 100, ellipsis: true },
    { title: '商审备注', dataIndex: 'businessRemark', scopedSlots: { customRender: 'businessRemark' }, width: 100, ellipsis: true },
    {
      title: '操作',
      dataIndex: 'operation',
      scopedSlots: { customRender: 'operation' },
      width: 200,
      fixed: 'right',
      align: 'center'
    }
  ]

  export default {
  components: { index, MouseMove, mouseClick },
    directives: { elDragDialog },
    data() {
      const fileUploadUrl = process.env.VUE_APP_BASE_API + 'file/uploadCache'
      return {

      headers: {"X-Token": getToken()},
      judge: false,
      projectName: '',
      previewVisible: false,
      previewImage: '',
      fileList2: [],

        supplyMessage:{
          visible: false,
          form:{},
        },
        //统计值
        minPrice: null,
        maxPrice: null,
        quote:{
          loading: false,
          selected: [],
          data: [],
          pagination: {
            showTotal: total => `共 ${total} 条结果`,
            showQuickJumper: true,
            showSizeChanger: true,
            pageSizeOptions: ['10', '20', '50'],
            current: 1,
            pageSize: 10,
            total: 0,
            onChange: (item) => {
              this.quote.pagination.current = item
              this.toSearchQuote()
            },
            onShowSizeChange: (current, pageSize) => {
              this.quote.pagination.pageSize = pageSize
              this.toSearchQuote()
            }, // 改变每页数量时更新显示
          }
        },
        selectedRowKeys: [],
        toCheckLoading: false,
        checkUsers: [],
        sendCheckDialog: {
          visible: false,
          form: {},
          rules: {
            checkUsers: [
              { required: true, message: '不能为空', trigger: 'blur' }
            ],
          }
        },
        uploadKey: true,
        suppliers: [],
        currentTemplate: {},
        downloadLoading: false,
        quoteForm: {},
        quoteVisible: false,
        status: ['未审核', '通过', '拒绝'],
        hasNextPage: true,
        currentPage: 1,
        tableHeight: document.documentElement.clientHeight-83-220,
        selectedId: [],
        quoteList: [],
        quoteLoading: true,
        file: {},
        excelRows: 0,
        inquiryList: [],
        searchForm: {},
        searchFormQuote: {},
        title: '新增询价',
        childLoading: {},
        form1: {},
        active1: 1,
        keys: {
          "供应商": 'supplier',
          "设备名称": 'name',
          "型号": 'model',
          "技术要求": 'params',
          "单位": 'unit',
          "数量": 'number',
          "报价品牌型号": 'suModel',
          "实际技术参数": 'suParams',
          "设备单价": 'suPrice',
          "设备总价": 'suTotalPrice',
          "货期": 'suDelivery',
          "质保期/售后": 'warranty',
          "备注": 'suRemark',
        },
        outputs: [],
        importData: '',
        visible: false,
        visible2: false,
        projects: [],
        loading: false,
        form: {},
        innerColumns,
        editingKey: '',
        newInquiry: [],
        cacheInquiry: [],
        active: 1,
        fileUploadUrl,
        fileList: [],
        fileList1: [],
        submitLoading: false,
        roles: [],
        proChecks: [],
        codeRules: {
          proDetailId: [
            { required: true, message: '不能为空', trigger: 'blur' }
          ],
          deviceTypeId: [
            { required: true, message: '不能为空', trigger: 'blur' }
          ],
          supplier: [
            { required: true, message: '不能为空', trigger: 'blur' }
          ],
          name: [
            { required: true, message: '不能为空', trigger: 'blur' }
          ],
        },
        poolChooseVisible: false,
        poolChooseLoading: false,
        poolChooseForm: {},
        poolChooseSearchForm: {},
        poolData: [],








        poolRecord: {},
        poolDialog: {
          form: {},
          searchForm: {},
          visible: false,
          submitLoading: false,
          table: {
            loading: false,
            data: [],
            selected: [],
            pagination: {
              showTotal: total => `共 ${total} 条结果`,
              showQuickJumper: true,
              showSizeChanger: true,
              pageSizeOptions: ['10', '20', '50'],
              current: 1,
              pageSize: 10,
              total: 0,
              onChange: (item) => {
                this.poolDialog.table.pagination.current = item
                this.loadPool()
              },
              onShowSizeChange: (current, pageSize) => {
                this.poolDialog.table.pagination.pageSize = pageSize
                this.loadPool()
              }, // 改变每页数量时更新显示
            },
          },
        },
        url: {
          updateSupplyMessage: '/quote/updateSupplyMessage',
          findHistoryPrices: '/pool/findHistoryPrices',
          selectPoolToQuote: '/quote/selectPoolToQuote',
          cancelCompare: '/quote/cancelCompare',
          findBySupplierOrPro: '/quote/findBySupplierOrPro',
          statisticsQuotePrice: '/quote/statisticsQuotePrice'
        }
      }
    },
    created() {
      let user = getUser()
      if(user == 2002639401 || user == 1){
        this.judge = true
      }

      if (this.$route.query.proDetailId) {
        this.searchForm.proDetailId = this.$route.query.proDetailId
        this.toSearch()
      }

      this.init()
    },
    methods: {
      projectChange(scope){
        this.projects.forEach(x=>{
          if(x.id === scope){
            return this.projectName = x.name
          }
        })
      },
      handleCancel() {
        this.previewVisible = false;
      },
      handlePreview(file) {
        this.previewImage = file.url || file.preview;
        this.previewVisible = true;
      },
      handleChange1({ fileList }) {
        this.fileList2 = fileList;
      },
      rowClick(row, index) {
        return {
          on: {
            click: () => {
              let index = this.quote.selected.indexOf(row.id)
              if(index === -1){
                this.quote.selected.push(row.id)
              }else{
                this.quote.selected.splice(index, 1)
              }
            }
          }
        }
      },
      supplyMessageSubmit(){
        //处理图片ID
        let obj = {quote:{}, imageId: []}
        obj.quote = this.supplyMessage.form
        this.fileList2.map(i=>{
          if(i.response.status === 200){
            obj.imageId.push(i.response.fileId)
          }
        })
        postActionByJson(this.url.updateSupplyMessage, obj)
        .then(resp =>{
          this.$message.success(resp.data + '条' + resp.message)
        }).catch((e)=>{
          this.$message.error(e)
        }).finally(()=>{
          this.fileList2 = []
          this.supplyMessage.visible = false
          this.toSearchQuote()
        })
      },
      async updateSupplyMessage(record){
        //加载供应商
        await this.loadSuppliers()
        this.supplyMessage.form = record
        this.supplyMessage.visible = true
      },
      statisticsQuotePrice(){
        getAction(this.url.statisticsQuotePrice, {proDetailId: this.searchForm.proDetailId})
        .then(resp=>{
          this.maxPrice = resp.data['max']
          this.minPrice = resp.data['min']
        }).catch((e)=>{
          this.$message.error('统计错误')
        }).finally(()=>{

        })
      },
      dateTimeFormat,
      cancelCompare(){
        if(this.selectedRowKeys){
          postActionByQueryString(this.url.cancelCompare, {inquiryIds: this.selectedRowKeys})
          .then(resp =>{
            if(parseInt(resp.message) === 0){
              this.$message({ type: 'warning', message: '无取消'})
            }else{
              this.$message.success(resp.message + "条取消比价成功")
            }
          }).catch((e)=>{
            this.$message.error(e)
          }).finally(()=>{
            this.toSearch()
          })
        }
      },
      indexHandleSelectionChange(record) {
        const selectedId = []
        console.log(record)
        record.map(item => {
          selectedId.push(item)
        })
        this.selectedRowKeys = selectedId
      },
      batchSendCompare(){
        postActionByQueryString('/quote/sendCompare',{inquiryIds : this.selectedRowKeys})
        .then(resp => {
          this.$message({ message: resp.message, type: 'success' })
        })
        this.selectedRowKeys = []
      },
      async batchSendAudit(){
        this.sendCheckDialog.form={}
        this.toCheckLoading = true
        await this.loadCheckUsers()
        this.toCheckLoading = false
        this.sendCheckDialog.visible = true
        this.sendCheckDialog.form.id = this.selectedRowKeys
        //this.sendCheckDialog.form.name = row.name
      },
      onSelectChange(selectedRowKeys) {
        console.log('selectedRowKeys changed: ', selectedRowKeys);
        this.selectedRowKeys = selectedRowKeys;
      },
      sendCheckSubmit() {
        this.$refs['sendCheckDialogForm'].validate((valid) => {
          if (valid) {
            let form = this.sendCheckDialog.form
            if (this.sendCheckDialog.form.time&&this.sendCheckDialog.form.time.length>0) {
              form.startTime = this.sendCheckDialog.form.time[0]
              form.endTime = this.sendCheckDialog.form.time[1]
            }
            if (form.checkUsers&&form.checkUsers.length>0) {
              var checkUsers = ''
              form.checkUsers.map((user, index) => {
                checkUsers += index===0?""+user:"-"+user
              })
              form.checkUsers = checkUsers
            }
            this.projects.map(item => {
              if(item.id == this.searchForm.proDetailId) {
                form.msgContent = "项目【"+item.name+"】下的询价【"+form.name+"】需审核"
              }
            })
            postActionByJson('/quote/initiateAudit', form).then(resp=>{
              this.$message({ message: resp.message, type: 'success' })
              this.sendCheckDialog.visible = false
            })
          }else {
            console.log('error commit')
            return false
          }
        })
        this.selectedRowKeys = []
        /*request.get('/quote/initiateAudit?inquiryId='+row.id)
          .then(resp=>{
            this.$message({ message: resp.message, type: 'success' })
          })*/
      },
      loadCheckUsers() {
        getAction('/chapter/chapterAudit/findAllChapterAuditor', {}).then(resp=>{
          this.checkUsers = resp.data
        })
      },
      loadSuppliers() {
        getAction('/supply/supplier/findSupplierByParams', {})
          .then(resp => {
            this.suppliers = resp.data
          })
      },
      loadCurrentTemplate(id) {
        if (id) {
          this.currentTemplate = {}
          getAction('/inquiry/template/findInquiryTemplate', {id: id})
            .then(resp => {
              resp.data[0].jsonKeys = JSON.parse(resp.data[0].jsonKeys)
              resp.data[0].tableColumn = JSON.parse(resp.data[0].tableColumn)
              this.currentTemplate = resp.data[0]
            })
            .catch(() => {
              this.loading = false
            })
        }
      },
      handleCopy(text, event) {
        clip(text, event)
      },
      poolChooseSubmitHandler() {
        if(this.poolChooseForm.id){
          request.request({
            url: '/inquiry/inquiryChoosePool',
            method: 'post',
            headers: {
              'Content-Type': 'application/x-www-form-urlencoded'
            },
            data: qs.stringify({'inquiryId': this.poolChooseForm.inquiryId, 'proPoolId': this.poolChooseForm.id, 'operator': getUser()})
          }).then(resp => {
            this.$message({ message: resp.message, type: 'success' })
            this.poolChooseVisible = false
            this.init()
          })
        }
      },
      find(){
        if(this.poolChooseSearchForm.name || this.poolChooseSearchForm.model){
          request.request({
            url: '/pool/fuzzyQueryByNameOrModel',
            method: 'get',
            headers: {
              'Content-Type': 'application/x-www-form-urlencoded'
            },
            params: {name: this.poolChooseSearchForm.name, model: this.poolChooseSearchForm.model}
          }).then(resp => {
            this.poolData = resp.data
          })
        }else {
          this.$message({ message: "请输入查询条件", type: 'warning' })
        }
      },
      addQuoteSubmit() {
        if(this.quoteForm.id){
          this.quoteForm.operator = parseInt(getUser())
          request.request({
            url: '/quote/addQuote',
            method: 'post',
            headers: {
              'Content-Type': 'application/x-www-form-urlencoded'
            },
            data: qs.stringify(this.quoteForm)
          }).then(resp => {
            this.$message({ message: resp.message, type: 'success' })
            this.quoteVisible = false
            this.loadChildTable({id: this.quoteForm.inquiryId})
          })
        }
      },
      deleteQuote(row) {
        this.$confirm('将删除选中报价, 是否删除?', '提示', {
          confirmButtonText: '删除',
          cancelButtonText: '取消',
          type: 'warning'
        }).then(() => {
          request.request({
            url: '/quote/batchSetInvalid',
            method: 'post',
            headers: {
              'Content-Type': 'application/x-www-form-urlencoded'
            },
            data: qs.stringify({ids: [row.id]})
          })
            .then(response => {
              this.$message({ message: response.message, type: 'success' })
              this.loadChildTable({id: row.inquiryId})
            })
        })
      },
      addQuote(row) {
        this.quoteVisible = true
        this.quoteForm = row
      },
      statu(text) {
        return text!=null?this.status[parseInt(text)]:'未送审'
      },
      tableRowClassName2(row, index) {
        if(row.dataSource == 0){
          return 'warning-row';
        }
        return ''
      },
      tableRowClassName(row, index){
        if (row.poolNum != 0 && !(row.veto == 1 || row.refuseNum != 0)) {
          return 'warning-row';
        }else if(row.veto == 1 || row.refuseNum != 0){
          return 'danger-row';
        }
        return '';
      },
      batchDelete() {
        this.$confirm('将删除选中报价价, 是否删除?', '提示', {
          confirmButtonText: '删除',
          cancelButtonText: '取消',
          type: 'warning'
        }).then(() => {
          if (this.quote.selected.length > 0) {
            request.request({
              url: '/quote/batchSetInvalid',
              method: 'post',
              headers: {
                'Content-Type': 'application/x-www-form-urlencoded'
              },
              data: qs.stringify({ids: this.quote.selected})
            })
              .then(response => {
                this.$message({ message: response.message, type: 'success' })
                this.quoteInit()
              })
          }
        })
      },
      handleSelectionChange(ids) {
        const selectedId = []
        ids.map(id => {
          selectedId.push(id)
        })
        this.quote.selected = selectedId
      },
      tabClick(record) {
       // console.log(record.label)
        if (record.label === '供应商报价管理') {
          this.quoteInit()
        }else if(record.label === '供应商报价管理') {
          this.init()
        }
      },
      quoteInit() {
        this.toSearchQuote()
      },
      toSearchQuote() {
        //重置参数
        this.quote.loading = true
        this.searchFormQuote.pageNum = this.quote.pagination.current
        this.searchFormQuote.pageSize = this.quote.pagination.pageSize
        getAction(this.url.findBySupplierOrPro, this.searchFormQuote)
        .then(resp =>{
            this.quote.pagination.current = parseInt(resp.data.current)
            this.quote.pagination.pageSize = parseInt(resp.data.size)
            this.quote.pagination.total = parseInt(resp.data.total)
            this.quote.data = resp.data.records
        }).catch((e)=>{

        }).finally(()=>{
          this.quote.loading = false
        })
      },
      async init() {
        await this.loadProjects()
        if(this.projects.length > 0){
          if(!this.searchForm.proDetailId) {
            this.$set(this.searchForm, 'proDetailId', this.projects[0].id)
          }
          this.toSearch()
        }else {
          //this.loading = false
        }
      },
      toSearch() {
        if(this.searchForm.proDetailId) {
          this.selectedRowKeys = []
          this.loading = true
          request.request({
            url: '/inquiry/findByProDetailId',
            method: 'get',
            params: this.searchForm
          })
          .then(async(response) => {
            response.data.map(item => {
              item.detailList = []
            })
            if (response.data.length > 0) {
              await this.loadCurrentTemplate(response.data[0]['templateId'])
            }
            this.inquiryList = response.data
            this.loading = false
          })
          .catch(() => {
            this.loading = false
          })
          //供应商报价管理与报价管理联动
          this.searchFormQuote.proId = this.searchForm.proDetailId
        }
        //查询统计数值
        this.statisticsQuotePrice()
      },
      toEdit(record){
        this.submitLoading = false
        this.form = record
        this.active = 1
        this.visible = true
        this.fileList = []
        this.fileList1 = []
        this.title = '编辑询价'
        this.fileList = []
        getAction('/file/findByOtherId',{otherId: this.form.id, type: 1})
          .then(resp => {
            resp.data.map(item => {
              let response = item
              response.error = 0
              response.fileId = response.id
              response.fileName = response.name
              this.fileList.push({
                uid: 0-item.id,
                name: item.name,
                operator: item.operator,
                status: 'done',
                response: response,
                url: response.url
              })
            })
          })
      },
      clickFileInput() {
        if (this.form1.supplierId) {
          this.$refs.upload.dispatchEvent(new MouseEvent('click'))
        }else {
          this.$message({ type: 'warning', message: '请选择供应商'})
        }
      },
      readExcel(e) {//表格导入
        var that = this;
        const files = e.target.files;
        //console.log(files);
        if(files.length<=0){//如果没有文件名
          return false
        }else if(!/\.(xls|xlsx)$/.test(files[0].name.toLowerCase())){
          this.$message.error('上传格式不正确，请上传xls或者xlsx格式')
          return false
        }

        const fileReader = new FileReader();
        this.excelRows = 0
        fileReader.onload = (ev) => {
          try {
            const data = ev.target.result;
            const workbook = XLSX.read(data, {
              type: 'binary'
            });
            const wsname = workbook.SheetNames[0];//取第一张表
            const ws = XLSX.utils.sheet_to_json(workbook.Sheets[wsname]);//生成json表格内容
            that.outputs = [];//清空接收数据
            ws.map(item => {
              var num = Object.keys(item).length
              //console.log(item)
              if(item['序号']&& num > 2){
                that.outputs.push(item);
                this.excelRows ++
              }
            })
            //console.info(this.outputs)
            if(this.excelRows > 0){
              let formData = new FormData();
              formData.append('file', this.$refs.upload.files[0])
              request.request({
                url: '/file/uploadCache',
                method: 'post',
                headers: {
                  'Content-Type': 'multipart/form-data'
                },
                data: formData
              }).then(response => {
                this.file.id = response.fileId
                this.file.name = response.fileName
                this.file.url = response.url
              })
            }
            this.$refs.upload.value = '';
          } catch (e) {
            return false;
          }
        };
        fileReader.readAsBinaryString(files[0]);
      },
      importHandler(form1) {
        this.$refs[form1].validate((valid) => {
          if (valid && this.file.id) {
            this.submitLoading = true
            let form = {files:[]}
            let userId = parseInt(getUser())
            form.files.push(this.file)
            form.proDetailId = this.form1.proDetailId
            form.operator = userId
            form.supplierId = this.form1.supplierId
            request.request({
              url: '/quote/batchAddQuote',
              method: 'post',
              headers: {
                'Content-Type': 'application/json'
              },
              data: JSON.stringify(form)
            }).then( response => {
              this.$message({ message: response.message, type: 'success' })
              this.visible2 = false
              this.submitLoading = false
              this.init()
            }).catch(()=>{
              this.submitLoading = false
            })

          } else {
            this.$message({ message: "文件上传解析中", type: 'warning' })
            return false
          }
        })
      },
      dateFormat,
      batchImport() {
        if (this.searchForm.proDetailId) {
          this.loadSuppliers()
          this.visible2 = true
          this.form1.proDetailId = this.searchForm.proDetailId
          this.submitLoading = false
          this.importData = ''
        }else {
          this.$message({type: 'warning', message: '请选择项目'})
        }

        //this.loadProChecks()
      },
      removeCheck(role) {
        /* this.proChecks.map((item,index) => {
          if(role.id === item.roleId){
            this.proChecks.splice(index,1);
          }
        })*/
        this.proChecks.splice(this.proChecks.findIndex(item => item.roleId === role.id), 1)
      },
      addCheck(role) {
        this.proChecks.push({ checkName: role.checkName, roleId: role.id })
      },
      loadProChecks() {
        request.get('/role/selectAllHasCheckName')
          .then(response => {
            this.roles = response.data
          })
      },
      handleChange(value, record, column) {
        this.inquiryList.forEach((item, index) => {
          if (item.id === record.proDetailId) {
            this.newInquiry = [...this.inquiryList[index].detailList]
          }
        })
        const target = this.newInquiry.filter(item => record.id === item.id)[0]
        if (target) {
          target[column] = value
          this.inquiryList.forEach((item, index) => {
            if (item.id === record.proDetailId) {
              this.inquiryList[index].detailList = this.newInquiry
            }
          })
        }
      },
      edit(record) {
        this.inquiryList.forEach((item, index) => {
          if (item.id === record.inquiryId) {
            this.newInquiry = [...this.inquiryList[index].detailList]
          }
        })
        this.cacheInquiry = this.newInquiry.map(item => ({ ...item }))
        const target = this.newInquiry.filter(item => record.id === item.id)[0]
        this.editingKey = record.id
        if (target) {
          target.editable = true
          this.inquiryList.forEach((item, index) => {
            if (item.id === record.inquiryId) {
              this.inquiryList[index].detailList = this.newInquiry
            }
          })
        }
      },
      save(record) {
        this.inquiryList.forEach((item, index) => {
          if (item.id === record.inquiryId) {
            this.newInquiry = [...this.inquiryList[index].detailList]
          }
        })
        const newCacheData = [...this.cacheInquiry]
        const target = this.newInquiry.filter(item => record.id === item.id)[0]
        const targetCache = newCacheData.filter(item => record.id === item.id)[0]
        request.request({
          url: '/quote/rowSave',
          method: 'post',
          headers: {
            'Content-Type': 'application/json'
          },
          data: JSON.stringify(record)
        })
          .then(response => {
            this.$message({ message: response.message, type: 'success' })
            if (target && targetCache) {
              delete target.editable
              this.inquiryList.forEach((item, index) => {
                if (item.id === record.inquiryId) {
                  this.inquiryList[index].detailList = this.newInquiry
                }
              })
              Object.assign(targetCache, target)
              this.cacheInquiry = newCacheData
            }
          })
        this.editingKey = ''
      },
      cancel(record) {
        this.inquiryList.forEach((item, index) => {
          if (item.id === record.inquiryId) {
            this.newInquiry = [...this.inquiryList[index].detailList]
          }
        })
        const target = this.newInquiry.filter(item => record.id === item.id)[0]
        this.editingKey = ''
        if (target) {
          Object.assign(target, this.cacheInquiry.filter(item => record.id === item.id)[0])
          delete target.editable
          this.inquiryList.forEach((item, index) => {
            if (item.id === record.inquiryId) {
              this.inquiryList[index].detailList = this.newInquiry
            }
          })
        }
      },
      saveRecordHandler(form) {
        switch (this.active) {
          case 1:
            this.$refs[form].validate((valid) => {
              if (valid) {
                this.fileList1 = []
                if (this.form.id) {
                  getAction('/file/findByOtherId',{otherId: this.form.id, type: 2})
                    .then(resp => {
                      resp.data.map(item => {
                        let response = item
                        response.error = 0
                        response.fileId = response.id
                        response.fileName = response.name
                        this.fileList1.push({
                          uid: 0-item.id,
                          name: item.name,
                          operator: item.operator,
                          status: 'done',
                          response: response,
                          url: response.url
                        })
                      })
                    })
                    .finally(()=> {
                      this.active++
                    })
                }else {
                  this.active++
                }
              } else {
                console.log('error commit')
                return false
              }
            })
            break
          case 2:
            this.submitLoading = true


            const fileList = this.fileList.map(item => {
              return { id: item.id, name: item.name, url: item.url, type: 0, operator: item.response.operator }
            })
            const fileList1 = this.fileList1.map(item => {
              return { id: item.id, name: item.name, url: item.url, type: 0, operator: item.response.operator }
            })
            this.form.inquiryFiles = fileList
            this.form.technologyFiles = fileList1
            this.form.operator = parseInt(getUser())
            //this.form.proChecks = this.proChecks
            request.request({
              url: '/quote/saveOrUpdate',
              method: 'post',
              headers: {
                'Content-Type': 'application/json'
              },
              data: JSON.stringify(this.form)
            }).then(response => {
              this.submitLoading = false
              this.visible = false
              this.$message({ message: response.message, type: 'success' })
            })
            break
        }
      },
      cancelHandler() {
        if (this.active === 1) {
          this.visible = false
        } else {
          this.active--
        }
      },
      cancelHandler2() {
        /*if (this.active1 === 1) {
          this.visible2 = false
        } else {
          this.active1--
        }*/
        this.visible2 = false
      },
      toAdd() {
        this.submitLoading = false
        this.form = {}
        this.active = 1
        this.visible = true
        this.fileList = []
        this.fileList1 = []
        this.loadProChecks()
      },
      loadChildTable(record) {
        this.childLoading[record.id] = true
        request.request({
          url: '/quote/findByInquiryId?inquiryId=' + record.id,
          method: 'get'
        }).then(response => {
          this.inquiryList.forEach((item, index) => {
            if (item.id === record.id) {
              this.inquiryList[index].detailList = response.data
              this.childLoading[record.id] = false
            }
          })
        })
      },
      expandChange(expanded, record) {
        if (expanded) {
          this.loadChildTable(record)
        }else {
          //this.childLoading[record.id] = true
        }
      },
     async loadProjects() {
        await request.get('/project/detail/findByAll')
          .then(response => {
            this.projects = response.data
          })
      },
      beforeUpload,
      uploadStatusChange,
      uploadStatusChange1(info) {
        if (info.file.status === 'uploading' || info.file.response.error === 0) {
          let fileList = [...info.fileList]
          fileList = fileList.map(file => {
            if (file.response) {
              file.url = file.response.url
              file.id = file.response.fileId
              file.name = file.response.fileName
            }
            return file
          })

          this.fileList1 = fileList
        }
      },



















      poolSubmit() {
        this.poolDialog.submitLoading = true
        if(this.poolDialog.table.selected.length === 1){
          postActionByQueryString(this.url.selectPoolToQuote, {
            poolId: this.poolDialog.table.selected, itemId: this.itemId})
            .then(resp => {
              this.$message.success(resp.message)
            }).catch(()=>{
            this.$message.error('提交失败')
          }).finally(()=>{
            this.poolDialog.visible = false
            this.poolDialog.submitLoading = false
            this.loadChildTable(this.poolRecord)
          })
        }else {
          this.$message.error('选取有误')
        }
      },
      poolTableChange(ids, rows){
        this.poolDialog.table.selected = ids
      },
      poolFind() {
        this.name = this.poolDialog.searchForm.name
        this.loadPool()
      },
      poolChoose(row) {
        this.poolDialog.submitLoading = false
        this.poolDialog.visible = true
        this.poolDialog.form = row
        this.poolRecord = row
        this.itemId = row.id
        this.loadPool()
      },
      loadPool() {
        this.poolDialog.table.loading = true
        this.poolDialog.submitLoading = true
        this.poolDialog.table.selected = []
        getAction(this.url.findHistoryPrices,{name: this.name, model: this.poolDialog.searchForm.model,
          pageNum: this.poolDialog.table.pagination.current,
          pageSize: this.poolDialog.table.pagination.pageSize})
          .then(resp => {
            this.poolDialog.table.data = resp.data.records
            this.poolDialog.table.pagination.current = parseInt(resp.data.current)
            this.poolDialog.table.pagination.pageSize = parseInt(resp.data.size)
            this.poolDialog.table.pagination.total = parseInt(resp.data.total)
          }).catch(() => {
          this.$message.error('查询错误')
        }).finally(()=>{
          this.poolDialog.table.loading = false
          this.poolDialog.submitLoading = false
        })
      },


    
    }
  }
  </script>


<style lang="scss" scoped>
  .pro_quote_list {
    margin: 10px;
    /deep/.el-form-item__content{
      height:auto;
      line-height:32px;
      margin-left:90px!important
    }
    .parentTable {
      /deep/.warning-row {
        background: #eae2c5;
      }
      /deep/.danger-row {
        background: #f1b7b7;
      }
    }
    .el-tabs__content {
      background: #fafafa;
    }
    .ant-table-body {
      overflow-x: auto !important;
    }
    .childTable{
      th, td, .ant-table-column-sorters, .ellipsis {
        display: block;
        overflow: hidden;
        white-space: nowrap;
        text-overflow: ellipsis;
        cursor: pointer;
        max-width: 110px!important;
        font-size: 12px;
        span, div {
          font-size: 12px;
        }
      }
      td, .ant-table-column-sorters {
        padding: 10px 8px;
      }
      th {
        padding: 10px 2px;
      }
    }
    .noData .ant-table-body {
      overflow: hidden!important;
    }
    .el-dialog__body {
      .el-form-item__label, .el-form-item__content{
        height: 28px!important;
        line-height: 28px!important;
      }
      .el-form-item {
        height: 28px!important;
        margin-bottom: 18px!important;
        line-height: 28px!important;
      }
      .el-col {
        padding: 0 6px;
      }
      .removeBox {
        height: 100%;
        position: absolute;
        top: 0;
        width: 32px;
        left: 210px;
        i {
          width: 32px;
          height: 24px;
          cursor: pointer;
          color: #319efc;
        }
      }
    }
    .outputlist_upload {
      opacity: 0;
      width: 0;
      overflow: hidden;
    }
    .importDialog {
      .el-form-item {
        .el-form-item__content {
          margin: 0 8px 0 0 !important;
        }
      }
    }
  }
</style>

